import { PureComponent } from 'react'
import { Input, Button } from 'antd'
import SingleTable from 'components/table/index'
import styles from './costControl.less'
export default class WriteOff extends PureComponent {
    render(){
        const columns = [
            {
                key: 'gmtCreate',
                title: '转运单号',
                dataIndex: 'gmtCreate',
                align: 'center',
            },
            {
                key: 'operationTypeName',
                title: '国内转运单号',
                dataIndex: 'operationTypeName',
                align: 'center',
            },
            {
                key: '28',
                title: '创建时间',
                dataIndex: 'operationTypeName',
                align: 'center',
            },
            {
                key: 'creatorName',
                title: '出库日期',
                dataIndex: 'creatorName',
                align: 'center',
            },
            {
                key: '4',
                title: '客户会员号',
                dataIndex: 'creatorName',
                align: 'center',
            },
            {
              key: '5',
              title: '订单状态',
              dataIndex: 'creatorName',
              align: 'center',
            },
            {
                key: '6',
                title: '物流状态',
                dataIndex: 'creatorName',
                align: 'center',
            },
            {
                key: '7',
                title: '始发港',
                dataIndex: 'creatorName',
                align: 'center',
            },
            {
                key: '8',
                title: '目的港',
                dataIndex: 'creatorName',
                align: 'center',
            },
            {
                key: '9',
                title: '支付方式',
                dataIndex: 'creatorName',
                align: 'center',
            },
            {
                key: '10',
                title: '支付状态',
                dataIndex: 'creatorName',
                align: 'center',
            },
            {
                key: '11',
                title: '退款状态',
                dataIndex: 'creatorName',
                align: 'center',
            },
            {
                key: '12',
                title: '优惠原因',
                dataIndex: 'creatorName',
                align: 'center',
            },
            {
                key: '13',
                title: '申退金额',
                dataIndex: 'creatorName',
                align: 'center',
            },
            {
                key: '14',
                title: '货币单位',
                dataIndex: 'creatorName',
                align: 'center',
            },
            {
                key: '15',
                title: '美元汇率',
                dataIndex: 'creatorName',
                align: 'center',
            },
            {
                key: '16',
                title: '优惠金额',
                dataIndex: 'creatorName',
                align: 'center',
            },
            {
                key: '17',
                title: '其他费用',
                dataIndex: 'creatorName',
                align: 'center',
            },
            {
                key: '18',
                title: '基本运费',
                dataIndex: 'creatorName',
                align: 'center',
            },
            {
                key: '19',
                title: '总费用',
                dataIndex: 'creatorName',
                align: 'center',
            },
            {
                key: '20',
                title: '已收款',
                dataIndex: 'creatorName',
                align: 'center',
            },
            {
                key: '21',
                title: '未收款',
                dataIndex: 'creatorName',
                align: 'center',
            },
            {
                key: '23',
                title: '订单解锁记录',
                dataIndex: 'creatorName',
                align: 'center',
            },
          ]
          const dataList = []
        return(
            <div className={styles.costControl}>
                <div className={styles.costControlBox}>
                    <h2>销账</h2>
                </div>
                <div className={styles.costControlSearch}>
                    <div className={styles.costControlSin} >
                        <span className={styles.costControlSpan}>IAE运单号：</span>
                        <Input className={styles.costControlInput} />
                    </div>
                    <div className={styles.costControlSin} style={{marginLeft: '28px'}}>
                        <span className={styles.costControlSpan}>国内运单号：</span>
                        <Input className={styles.costControlInput} />
                    </div>
                </div>
                <div className={styles.costControlButton}>
                    <Button type="primary" icon="search">查询</Button>
                </div>
                <div className={styles.costControlTable}>
                   <SingleTable
                        data={{ list: dataList }}
                        columns={columns}
                    />
                </div>
            </div>
        )
    }
}